//导入模块
const gulp=require("gulp")
const uglify = require('gulp-uglify')//js压缩
const cleanCSS = require('gulp-clean-css');//css压缩
// const imagemin = require('gulp-imagemin');
const rev = require('gulp-rev');//去缓存
const htmlmin = require('gulp-htmlmin');//html压缩
var revCollector = require('gulp-rev-collector');//html去缓存
const babel = require('gulp-babel');//ES6转ES5

// const server = require('browser-sync').create(); 
// const watch = require('gulp-watch');
const connect = require('gulp-connect');
// const Proxy = require('gulp-connect-proxy');
const { createProxyMiddleware } = require('http-proxy-middleware');


//开发服务器
// gulp.task('watch', function () {
//     gulp.watch(['src/html/*.html'], ['html']);
// });


// gulp.task("serve", function () {
//     connect.server({
//         root: "./src",
//         port: 8000,
//         livereload: true,
//         middleware: function (connect, opt) {
//             opt.route = '/proxy';
//             var proxy = new Proxy(opt);
//             return [proxy];
//         }
//     });
// });
gulp.task('serve', function() {
    connect.server({
        root: './src',
        port: 8000,
        livereload: true,
        middleware: function(connect, opt) {
            return [
                createProxyMiddleware('/api',  {
                    target: 'http://localhost:8080',
                    changeOrigin:true
                }),
                createProxyMiddleware('/proxy', {
                    target: 'https://www.baidu.com/sugrec?pre=1&p=3&ie=utf-8&json=1&prod=pc&from=pc_web&wd=html&req=2&csor=4&pwd=htm',
                    changeOrigin:true
                })
            ]
        }

    });
});

// gulp.task('default', ['connect', 'watch']);
// gulp.task('default',()=>{
//     console.log("hello");
// })
// gulp.task('serve', function() {
//      server.init({
//         server:'./src',
//         port: 3000
//     })

    // 监控文件修改
    // watch('src/html/*.html', function() {
    //     console.log('你修改HTML文件了')
    //     server.reload()
    // })
    // watch('src/css/*.css', function() {
    //     console.log('你修改CSS文件了')
    //     server.reload()
    // }) 
    // watch('src/js/*.js', function() {
    //     console.log('你修改JS文件了')
    //     server.reload()
    // })
// })
gulp.task('js', over =>{
    gulp
        .src('./src/js/*.js')
        .pipe(babel({
			presets: ['@babel/preset-env']
		}))
        .pipe(uglify())
        .pipe(rev())
        .pipe(gulp.dest("dist/js"))
        .pipe(rev.manifest()) // 生成一个rev-manifest.json文件，记录MD5的文件改名前后的对应关系
        .pipe(gulp.dest('temp/js')) // 将 rev-manifest.json 保存到 rev
        over()
 });

 gulp.task('css',over=>{
     gulp
     .src('./src/css/*.css')
     .pipe(cleanCSS())
     .pipe(rev())
     .pipe(gulp.dest("dist/css"))
     .pipe(rev.manifest()) // 生成一个rev-manifest.json文件，记录MD5的文件改名前后的对应关系
     .pipe(gulp.dest('temp/css')) // 将 rev-manifest.json 保存到 rev
     setTimeout(()=>{
         over()
     },30000)
 })
//  gulp.task("imgs",()=>{
//     gulp
//     .src('./src/imgs/*.*')
//     .pipe(imagemin())
//     .pipe(gulp.dest("dist/imgs"))
//  })

 gulp.task("html",over=>{
    var options = {
               removeComments: true, //清除HTML注释
                collapseWhitespace: true, //压缩HTML
                 minfyJS: true,//压缩JS
                 minfyCss: true,//压缩CSS
             };
    //  gulp
    gulp
    .src(['temp/**/*.json', 'src/html/*.html'])
    .pipe(connect.reload())
    // .src('./src/html/*.html')
    .pipe( revCollector({
        replaceReved: true,
        dirReplacements: {
            './../js': './js',
            './../css': './css/',
            'cdn/': function(manifest_value) {
                return '//cdn' + (Math.floor(Math.random() * 9) + 1) + '.' + 'exsample.dot' + '/img/' + manifest_value;
            }
        }
    }) )
    .pipe(htmlmin(options))
    .pipe(gulp.dest("dist/html"))
    over()
 })

//打包上线配置
gulp.task('build',gulp.series('js','css','html',()=>{
    console.log("bulid ok");
}))


 